<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
		<style>
		*{
			margin: 0;
			padding: 0;
			list-style-type: none;
			text-decoration: none;
			color: #000;
		}
		.nav{
			width: 1000px;
			height: 80px;
			margin: 0px auto;
		}
		.logo{
			width: 200px;
			height: 80px;
			float: left;
		}
		.logo img{
			margin-top: 7.5px;
		}
		.list{
			width: 700px;
			height: 80px;
			float: right;
		}
		.list li{
			width: 100px;
			height: 80px;
			float: left;
			text-align: center;
			line-height: 80px;
		}
		.banner{
			width: 100%;
			height: 400px;
		}
		.banner img{
			width: 100%;	
		}
		.product{
			width: 900px;
			height: 300px;
			margin: 0px auto;
			padding: 0px 50px;
		}
		.product div{
			width: 300px;
			height: 300px;
			float: left;
			text-align: center;
		}
		.product div img{
			border-radius: 50%;
			margin: 40px 0px 20px 0px;
		}
		.product div p{
			color: #888888;
			font-size: 13px;
			margin-top: 10px;
		}
		.a{
			text-align: center;
		}
		.a p{
			color: #888888;
		}
		.a1{
			letter-spacing: 2px;
			color: #888888;
			font-size: 13px;
		}
		.a2{
			letter-spacing: 6px;
			color: #888888;
			font-size: 13px;
		}
		.box{
			width: 900px;
			height: 1000px;
			margin: 0px auto;
			padding: 0px 50px;
		}
		.box span{
			color: #B9B9B9;
			font-size: 13px;
		}
		.box p{
			margin-top:20px;
			color: #7F7F7F;
			font-size: 13px;
		}		
		.box>div{
			width: 300px;
			float: left;
			text-align:left;
			margin-top: 50px;
			margin-bottom: 20px;
		}
		.box1{
			border: 1px solid #C3C3C3;
			width: 80px;
			margin-top:20px;
			color: #C3C3C3
		}
		.box2{
			margin-top:37px;
		}
		.b{
			border: 1px solid red;
			width: 1000px;
			height: 30px;
			line-height: 30px;
			text-align:center;
			
		}
		/*.b p{
			color: #6B6B6B;
			font-size: 13px;
			margin: 0px auto;

		}*/
	</style>
</head>
<body>
	<div class="nav">
		<div class="logo">
			<img src="img/logo.png" alt="">
		</div>
		<ul class="list">
			<li>首页</li>
			<li>关于软景</li>
			<li>新闻中心</li>
			<li>产品介绍</li>
			<li>招贤纳士</li>
			<li>下载中心</li>
			<li>联系我们</li>
		</ul>
	</div>
	<div class="banner">
		<img src="img/banner.jpg" alt="">
	</div>

	<div class="product">
		<div>
			<img src="img/icon-01.jpg" alt="">
			<h3>行业解决方案</h3>
			<p>客户服务体系，对讲集群系统<br>手机名片，移动业务，解决方案</p>
		</div>
		<div>
			<img src="img/icon-02.jpg" alt="">
			<h3>运行服务体系</h3>
			<p>为客户提供完善的顾问服务体系<br>和业内最全的技术资料宝库。</p>
		</div>
		<div>
			<img src="img/icon-03.jpg" alt="">
			<h3>人才战略方案</h3>
			<p>携手软景，谱写未来！<br>感受软景给你带来的无限可能！</p>
		</div>				
	</div>

    <div class="a">
			<h1>产品展示</h1>
			<p>——————————————<span class="a1"> P R O D U C T D I S P L A Y </span> ——————————————</p>
			<span class="a2">科技创造未来，服务创造价值</span>
	</div>

	<div class="box">
		<div>
			<img src="img/img01.jpg" alt="">
			<h2>服务器</h2>
			<span>THE SERVER</span>
		    <P>存储 CPU&深度学习 HPC 视频监控 工控机<br>图形工作站 龙芯服务器 优选产品</p>
			<div class="box1">
		    <img src="img/img-arr.jpg">更多产品
			</div>
		</div>		    

		<div>
			<img src="img/img02.jpg" alt="">
			<h2>云计算</h2>
			<span>CLOUD COMPUTING</span>
		    <P>宝德云计算架构 宝德云 服务器整合 桌面云<br>宝德云一体机</p>
			<div class="box1">
		    	<img src="img/img-arr.jpg">更多产品
			</div>
		</div>

		<div>
			<img src="img/img03.jpg" alt="">
			<h2>云储存</h2>
			<span>CLOUD STORAGE</span>
		    <P>分布式系统 宝德GS-7200云储存<br>宝德GS-1000云储存</p>
			<div class="box1">
		    	<img src="img/img-arr.jpg">更多产品
			</div>
		</div>

		<div>
			<img src="img/img04.jpg" alt="">
			<h2>数据中心</h2>
			<span>INTERNET DATA CENTER</span>
		    <P>数据中心定制 模块化数据中心 机柜租用<br>服务器托管 服务器定制 宽带独享</p>
			<div class="box1">
		    	<img src="img/img-arr.jpg">更多产品
			</div>
		</div>

		<div>
			<img src="img/img05.jpg" alt="">
			<h2>大数据</h2>
			<span>BIG DATA</span>
		    <P>宝德大数据一体机</p>
			<div class="box1 box2">
		    	<img src="img/img-arr.jpg">更多产品
			</div>
		</div>

		<div>
			<img src="img/img06.jpg" alt="">
		    <h2>IT分销及其他</h2>
			<span>IT DISTRIBUTION AND OTHER</span>
		    <P>IT分销及其他</p>
			<div class="box1 box2">
		    	<img src="img/img-arr.jpg">更多产品
	    	</div>
	    </div>
	</div>

	<div class="b">
	    Copy right &copy;2014软景信息科技有限公司 版权所有 豫ICP备1324567890号
	</div>
</body>
</html>